<template>
  <div class="admin">

    <el-container style="height:937px">

      <el-header class="layout_harder" style="height: 100px">

        <button style="background-color: #1c2c3e;border: 0;float: left " @click="Collapse()"><img :src="imgId" alt=""
                                                                                                  style="width: 70px;height: 70px;;padding: 15px 0 0 0">
        </button>

        <router-link to="/admin/base/home"
                     style="font-size: 50px;margin: 0 0 0 15px;line-height: 95px;background-color: #1c2c3e;border: 0;color: white;text-decoration: none">
          禾邦物业管理后台系统
        </router-link>


        <div style="float: right">

          <div style="line-height: 100px">

            <el-button style="background-color:#1c2c3e;border: 0;color: white" icon="el-icon-refresh"
                       @click="reloadi()"></el-button>

            <el-dropdown>
                <span class="el-dropdown-link">admin<i class="el-icon-s-custom el-icon--right"></i>
                </span>
              <el-dropdown-menu slot="dropdown">
                <el-dropdown-item onclick="exitu()">退出登录</el-dropdown-item>

              </el-dropdown-menu>
            </el-dropdown>

          </div>
        </div>

      </el-header>


      <el-container class="layout-body">

        <el-menu
            router
            default-active="/admin/base/home"
            class="el-menu-vertical-demo"
            background-color="#545c64"
            text-color="#fff"
            :collapse="isCollapse"

            active-text-color="#ffd04b">
          <el-submenu index="/admin/core">
            <template slot="title">
              <i class="el-icon-school"></i>
              <span>核心业务处理</span>
            </template>
            <div style="margin:  0 0 0 10px">
              <el-menu-item index="/admin/core/parkingCharge"><i class="el-icon-truck"></i>车位收费管理</el-menu-item>
              <el-menu-item index="/admin/core/propertyCharges"><i class="el-icon-edit"></i>物业收费管理</el-menu-item>
              <el-menu-item index="/admin/core/complaint"><i class="el-icon-edit-outline"></i>投诉信息管理</el-menu-item>
              <el-menu-item index="/admin/core/repairInformation"><i class="el-icon-document"></i>报修信息管理
              </el-menu-item>
            </div>

          </el-submenu>

          <el-submenu index="/admin/base">
            <template slot="title">
              <i class="el-icon-s-data"></i>
              <span>基础信息管理</span>
            </template>
            <div style="margin:  0 0 0 10px">
              <el-menu-item index="/admin/base/building"><i class="el-icon-office-building"></i>楼宇管理</el-menu-item>
              <el-menu-item index="/admin/base/house"><i class="el-icon-house"></i>房屋管理</el-menu-item>
              <el-menu-item index="/admin/base/owner"><i class="el-icon-user-solid"></i>业主管理</el-menu-item>
              <el-menu-item index="/admin/base/parking"><i class="el-icon-location-outline"></i>车位管理</el-menu-item>
              <el-menu-item index="/admin/base/Meter"><i class="el-icon-watch-1"></i>抄表管理</el-menu-item>
              <el-menu-item index="/admin/base/administrators"><i class="el-icon-share"></i>管理员管理</el-menu-item>
            </div>
          </el-submenu>

          <el-submenu index="/admin/data">
            <template slot="title">
              <i class="el-icon-s-marketing"></i>
              <span>数据统计分析</span>
            </template>
            <div style="margin:  0 0 0 10px">
              <el-menu-item index="/admin/data/reportForRepair"><i class="el-icon-data-line"></i>报修统计分析
              </el-menu-item>
              <el-menu-item index="/admin/data/complaintStatistics"><i class="el-icon-phone"></i>投诉统计分析
              </el-menu-item>
            </div>
          </el-submenu>
        </el-menu>

        <el-main>
          <router-view/>
        </el-main>


      </el-container>

    </el-container>


  </div>


</template>
<script>
export default {
  data() {
    return {
      isCollapse: false,
      imgId: require('@/assets/图标.png'),


    };

  },
  methods: {
    reloadi() {
      location.reload();
    },

//退出登录
    exitu() {
      localStorage.removeItem("accessToken");
      //刷新部分
      reloadi();
    },


    Collapse() {
      if (this.isCollapse == true) {
        this.isCollapse = false
      } else {
        this.isCollapse = true
      }
    }
    ,


  }

}
</script>


<style>

* {
  margin: 0;
  padding: 0;
}

/*.layout-body{*/
/*  position: absolute;*/
/*  top: 60px;*/
/*  bottom: 0;*/
/*  left: 0;*/
/*  right: 0;*/
/*}*/
.layout_harder {
  background-color: #1c2c3e;
  font-size: 30px;
  font-weight: bold;
  color: azure
}

.layout_aside {
  height: 100%;
  background-color: #2c3e50;
  font-size: 30px;
  font-weight: bold;
  color: azure;
}

* {
  margin: 0;
  padding: 0;
}

/*.layout-body {*/
/*  position: absolute;*/
/*  top: 60px;*/
/*  bottom: 0;*/
/*  left: 0;*/
/*  right: 0;*/
/*}*/

.layout_harder {
  background-color: #1c2c3e;
  font-size: 30px;
  font-weight: bold;
  color: azure
}

.layout_aside {
  background-color: #2c3e50;
  font-size: 30px;
  font-weight: bold;
  color: azure;
}

</style>